﻿@model FFF.Test.Controllers.VM.LanguageSelectionViewModel
@{
    Layout = "~/Views/Shared/_Index_Layout.cshtml";
}
@section styles{
    <link href="~/lib/YdmJUI/static/plugins/easyui-ex/tabs/jeasyui.extensions.tabs.css" rel="stylesheet" />
}
@section scripts{
    <script src="~/lib/vue/vue.min.js"></script>
    <script src="~/lib/abp-web-resources/signalr-client/signalr.min.js"></script>
    <script src="~/lib/abp-web-resources/libs/abp.signalr-client.js"></script>
    <script src="~/lib/YdmJUI/static/plugins/easyui-ex/jquery.jdirk.js"></script>
    <script src="~/lib/YdmJUI/static/plugins/easyui-ex/tabs/jeasyui.extensions.tabs.dndTab.js"></script>
    <environment names="Development">
        <script src="~/js/views/Main/Home/index.js" asp-append-version="true"></script>
    </environment>
    <environment names="Staging,Production">
        <script src="~/js/views/Main/Home/index.min.js" asp-append-version="true"></script>
    </environment>
}
@*<script src="~/lib/abp-web-resources/signalr-client/signalr.min.js"></script>
    <script src="~/lib/abp-web-resources/libs/abp.signalr-client.js"></script>*@
<style>
    .nav-bar .nav-left {
        width: 230px;
        float: left;
    }

    .nav-bar .nav-right {
        float: right;
    }


    .nav-bar .nav-center {
        margin-left: 230px;
        margin-right: 245px;
        color: #fff;
        text-align: center;
        overflow: hidden;
    }

    .banner .nav-bar > div {
        height: 50px;
        line-height: 50px;
    }

    .nav-center ul {
        list-style-type: none;
        white-space: nowrap;
        overflow: hidden;
        display: inline-block;
        font-size: 0;
        position: relative;
        left: 0;
    }

        .nav-center ul li {
            display: inline-block;
            text-align: center;
            margin: 0;
            width: 100px;
        }

            .nav-center ul li a {
                text-decoration: none;
            }

    .nav-btn {
        display: inline-block;
        width: 20px;
        text-align: center;
        line-height: 50px;
        color: white;
        font-size: 20px;
    }

    .nav-group {
        position: relative;
        transition: all .3s;
        padding: 0;
    }
        /*.nav-bar .nav-btn:hover,.nav-bar .nav-group li:hover,.nav-bar .nav-group li a:hover{*/
        /*background: #367fa9;*/
        /*color:white;*/
        /*}*/
        .nav-group .bannerMenu {
            padding: 5px 0;
        }

    .hide {
        display: none !important;
    }
</style>

<div id="loading" class="loading-wrap">
    <div class="loading-content">
        <div class="loading-round"></div>
        <div class="loading-dot"></div>
    </div>
</div>

<div id="mm" class="submenubutton" style="width: 140px;">
    <div id="mm-tabclose" name="6" iconCls="fa fa-refresh">@L("刷新")</div>
    <div class="menu-sep"></div>
    <div id="Div1" name="1" iconCls="fa fa-close">@L("关闭")</div>
    <div id="mm-tabcloseother" name="3">@L("关闭其他")</div>
    <div id="mm-tabcloseall" name="2">@L("关闭全部")</div>
    <div class="menu-sep"></div>
    <div id="mm-tabcloseright" name="4">@L("关闭右侧标签")</div>
    <div id="mm-tabcloseleft" name="5">@L("关闭左侧标签")</div>
    <div class="menu-sep"></div>
    <div id="mm-newwindow" name="7">@L("新窗口中打开")</div>
</div>

<div data-toggle="topjui-layout" data-options="id:'index_layout',fit:true">
    <div id="north" class="banner" data-options="region:'north',border:false,split:false"
         style="height: 50px; padding:0;margin:0; overflow: hidden;">
        <div class="nav-bar">
            <div class="nav-left webname">
                <span class="fa fa-envira" style="font-size:26px; padding-right:4px;"></span>
                <a href="https://www.kancloud.cn/yudaming/ydmcore/1077107" target="_blank" style="color:white">Ydmcore框架</a>
                <span id="MyCollapseMenu" class="collapseMenu " style="text-align: center;cursor: pointer;font-size: 18px;padding-left: 5px;">
                    <span class="fa fa-chevron-circle-left"></span>
                </span>
            </div>
            <div class="nav-right" id="YdmCoreIndexNavRight">
                <span style=" padding-right: 8px; height: 50px; line-height: 50px;">
                    <a href="javascript:void(0)"
                       style="color:#fff;" id="MyUserNameIndex"></a>|
                    <a href="javascript:void(0)" id="mb5"
                       style="color:#fff;">公司设置</a>
                    <div id="mm5" style="width:74px;">
                    </div>|
                    <a href="javascript:void(0)" id="mb4"
                       style="color:#fff;">系统设置</a>
                    <div id="mm4" style="width:74px;">
                    </div>|
                    <a href="javascript:void(0)" id="mb3" data-toggle="topjui-menubutton"
                       data-options="menu:'#mm3',iconCls:'fa fa-cog',hasDownArrow:true" style="color:#fff;">@L("设置")</a>
                    <div id="mm3" style="width:74px;">
                        <div data-options="iconCls:'fa fa-info-circle'" onclick="javascript:handleUserInfo(0)">@L("个人信息")</div>
                        <div class="menu-sep"></div>
                        <div data-options="iconCls:'fa fa-key'" onclick="javascript:modifyPwd(0)">@L("修改密码")</div>
                        <div>
                            <span>@L("语言")</span>
                            <div>
                                @foreach (var language in Model.Languages)
                                {
                                    <div onclick="chgMyLanguage('@Url.Action("ChangeCulture", "AbpLocalization")?cultureName=@(language.Name)&returnUrl=@(Model.CurrentUrl)','@(language.Name)')">@language.DisplayName</div>
                                }
                            </div>
                        </div>
                        <div>
                            <span>@L("主题")</span>
                            <div>
                                <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('greenlight')"> @L("默认主题")</div>
                                <div data-options="iconCls:'fa fa-tree blue'" onclick="changeTheme('deepblue')">@L("深蓝色主题")</div>
                                @*<div data-options="iconCls:'fa fa-tree'" onclick="changeTheme('black')">@L("黑色主题")</div>
                                <div data-options="iconCls:'fa fa-tree'" onclick="changeTheme('blacklight')">@L("黑色主题-亮")</div>
                                <div data-options="iconCls:'fa fa-tree red'" onclick="changeTheme('red')">@L("红色主题")</div>
                                <div data-options="iconCls:'fa fa-tree red'" onclick="changeTheme('redlight')">@L("红色主题-亮")</div>
                                <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('green')">@L("绿色主题")</div>
                                <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('greenlight')">@L("绿色主题-亮")</div>
                                <div data-options="iconCls:'fa fa-tree purple'" onclick="changeTheme('purple')">@L("紫色主题")</div>
                                <div data-options="iconCls:'fa fa-tree purple'" onclick="changeTheme('purplelight')">@L("紫色主题-亮")</div>
                                <div data-options="iconCls:'fa fa-tree blue'" onclick="changeTheme('blue')">@L("蓝色主题")</div>
                                <div data-options="iconCls:'fa fa-tree blue'" onclick="changeTheme('bluelight')">@L("蓝色主题-亮")</div>
                                <div data-options="iconCls:'fa fa-tree orange'" onclick="changeTheme('yellow')">@L("橙色主题")</div>
                                <div data-options="iconCls:'fa fa-tree orange'" onclick="changeTheme('yellowlight')">@L("橙色主题-亮")</div>*@
                            </div>
                        </div>
                    </div>
                    @*|<a href="javascript:void(0)" id="mb2" data-toggle="topjui-menubutton"
                           data-options="menu:'#mm2',iconCls:'fa fa-tree',hasDownArrow:true" style="color:#fff;">主题</a>|
                        <div id="mm2" style="width:180px;">
                            <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('greenlight')">默认主题</div>
                            <div data-options="iconCls:'fa fa-tree'" onclick="changeTheme('black')">黑色主题</div>
                            <div data-options="iconCls:'fa fa-tree'" onclick="changeTheme('blacklight')">黑色主题-亮</div>
                            <div data-options="iconCls:'fa fa-tree red'" onclick="changeTheme('red')">红色主题</div>
                            <div data-options="iconCls:'fa fa-tree red'" onclick="changeTheme('redlight')">红色主题-亮</div>
                            <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('green')">绿色主题</div>
                            <div data-options="iconCls:'fa fa-tree green'" onclick="changeTheme('greenlight')">绿色主题-亮</div>
                            <div data-options="iconCls:'fa fa-tree purple'" onclick="changeTheme('purple')">紫色主题</div>
                            <div data-options="iconCls:'fa fa-tree purple'" onclick="changeTheme('purplelight')">紫色主题-亮</div>
                            <div data-options="iconCls:'fa fa-tree blue'" onclick="changeTheme('blue')">蓝色主题</div>
                            <div data-options="iconCls:'fa fa-tree blue'" onclick="changeTheme('bluelight')">蓝色主题-亮</div>
                            <div data-options="iconCls:'fa fa-tree orange'" onclick="changeTheme('yellow')">橙色主题</div>
                            <div data-options="iconCls:'fa fa-tree orange'" onclick="changeTheme('yellowlight')">橙色主题-亮</div>
                        </div>*@
                    <a href="javascript:void(0)" onclick="logout()" data-toggle="topjui-menubutton"
                       data-options="iconCls:'fa fa-sign-out',hasDownArrow:false" style="color:#fff;">@L("注销")</a>
                </span>
            </div>
            <div class="nav-center">
                <a class="nav-btn nav-left-btn topmenu " href="#" style="float: left;">
                    <i class="fa fa-angle-double-left"
                       aria-hidden="true"></i>
                </a>
                <a class="nav-btn nav-right-btn topmenu" href="#" style="float: right;">
                    <i class="fa fa-angle-double-right"
                       aria-hidden="true"></i>
                </a>
                <div style="overflow: hidden;position: relative;text-align: left" id="MyTopModule">
                    <ul class="nav-group">
                        <li :id="moduleItem.id" :title="moduleItem.moduleName" :class="[{'selected':selectIndex==index},'topmenu']"
                            v-for="(moduleItem,index) in moduleData" v-on:click="genMenus(moduleItem,index)">
                            <a class="l-btn-text bannerMenu" href="javascript:void(0)">
                                <p>
                                    <lable :class="getClass(moduleItem)"></lable>
                                </p>
                                <p><span style="white-space:nowrap;">{{$.dm.L(moduleItem.moduleName)}}</span></p>
                            </a>
                        </li>

                    </ul>
                </div>
            </div>
        </div>
    </div>

    <div id="west"
         data-options="region:'west',split:true,collapsed:true,width:230,border:false,headerCls:'border_left',bodyCls:'border_right'"
         title="" iconCls="fa fa-dashboard">
        <div data-options="region:'north',title:'North Title',split:true" class="serchBox" id="serchBoxIndexFormFunctionGUID">
            <input type="text" id="myIndexFormFunctionGUID" name="functionGUID" data-toggle="topjui-combobox"
                   data-options="required:false,
                                editable: true,
                                valueField:'id',
                                textField:'text',
                                loader: $.loader.comboxLoader,
                                mode: 'remote',
                                panelHeight:164,
                                prompt:'输入菜单名称,拼音,首字母简写',
                                formatter:formatSearchFunctionCombox,
                                onSelect:chgSelectMenu,
                                onClick:functionComboxClick,
                                onHidePanel:functionPanelHide,
                                queryParams:
                                {
                                    viewName:'View_FW_function',
                                    comBoxValueName:'functionName',
                                    initQuery:$('#myFormfunctionName').val(),
                                    selectNames: 'functionUrl,icon',
                                    order:'functionOrderCode asc',
                                    rows:50,
                                    initCondtions:[
                                        {
                                            Attribute: 'parentGUID',
                                            Datatype: 'uniqueidentifier',
                                            Operatoer: 'not-null'
                                        }
                                    ],
                                    filterDeal:fwFunctionFilterDeal
                                }">
        </div>
        <div id="RightAccordion"></div>
    </div>

    <div id="center" data-options="region:'center',border:false" style="overflow:hidden;">
        <div id="index_tabs" style="width:100%;height:100%">
            <div title="@L("系统首页")" iconCls="fa fa-home" data-options="border:true,iframe:true,
                 content:'<iframe src=\'/home/SystemIndex\' scrolling=\'auto\' frameborder=\'0\' style=\'width:100%;height:100%;\'></iframe>'"></div>
        </div>
    </div>

    @*<div data-options="region:'south',border:true"
             style="text-align:center;height:30px;line-height:30px;border-bottom:0;overflow:hidden;">
            <span style="float:left;padding-left:5px;width:30%;text-align: left;">当前用户：TopJUI前端框架</span>
            <span style="padding-right:5px;width:40%">
                版权所有 © 2014
                <a href="http://www.zuoyour.com" target="_blank">湖南佐佑时代科技有限公司</a>
                <a href="http://www.miitbeian.gov.cn" target="_blank">湘ICP备18018053号</a>
            </span>
            <span style="float:right;padding-right:5px;width:30%;text-align: right;">
                版本：
                <script>document.write(topJUI.version)</script>
            </span>
        </div>*@
</div>

<!--[if lte IE 8]>
<div id="ie6-warning">
    <p>您正在使用低版本浏览器，在本页面可能会导致部分功能无法使用，建议您升级到
        <a href="http://www.microsoft.com/china/windows/internet-explorer/" target="_blank">IE9或以上版本的浏览器</a>
        或使用<a href="http://se.360.cn/" target="_blank">360安全浏览器</a>的极速模式浏览
    </p>
</div>
<![endif]-->
<div class="layui-row" id="userInfo" style="display:none;">
    <div class="userInfo_container">
        <div class="userInfo_content">
            <div class="layui-form-item">
                <div class="userImg">
                    @*<span class="layui-icon layui-icon-close-fill deleIcon"></span>*@
                    <img :src="UserInfoData.userImageUrl" class="layui-upload-img" id="userImg" />
                </div>
                <button type="button" class="layui-btn upload" id="uploadImg">
                    <span class="layui-icon layui-icon-camera-fill"></span>
                </button>
            </div>
            <div class="layui-form-item">
                <div class="userInfo_name">
                    <label class="layui-form-label">@L("用户名"):</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" v-model="UserInfoData.userName" required lay-verify="required" placeholder="@L("请输入用户名")" autocomplete="off" class="layui-input" style="width: 300px">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="useInfo_autograph">
                    <label class="layui-form-label">@L("个性签名:")</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" v-model="UserInfoData.userSign" required lay-verify="required" placeholder="@L("请输入个性签名")" autocomplete="off" class="layui-input" style="width: 300px">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block" style="text-align:center; margin-left:10px">
                    <button class="layui-btn" type="button" lay-filter="demo1" v-on:click="saveUserInfo">@L("保存")</button>
                    <button type="reset" class="layui-btn layui-btn-primary" v-on:click="closeUserInfoPopup">@L("关闭")</button>
                </div>
            </div>
        </div>
    </div>
</div>

<!--搜索查询-->
<template id="SearchFunctionInPut" style="display:none">
    <input type="text" id="SearchFunctionCombox" name="functionGUID" data-toggle="topjui-combobox" autofocus="autofocus"
           data-options="required:false,
                                    editable: true,
                                    valueField:'id',
                                    textField:'text',
                                    loader: $.loader.comboxLoader,
                                    mode: 'remote',
                                    panelHeight:250,
                                    prompt:'输入菜单名称,拼音,首字母简写',
                                    formatter:formatSearchFunctionCombox,
                                    onSelect:chgSelectMenu,
                                    onClick:functionComboxClick,
                                    onHidePanel:functionPanelHide,
                                    queryParams:
                                    {
                                        viewName:'View_FW_function',
                                        comBoxValueName:'functionName',
                                        initQuery:$('#myFormfunctionName').val(),
                                        selectNames: 'functionUrl,icon',
                                        order:'functionOrderCode asc',
                                        rows:50,
                                        initCondtions:[
                                            {
                                                Attribute: 'parentGUID',
                                                Datatype: 'uniqueidentifier',
                                                Operatoer: 'not-null'
                                            }
                                        ],
                                        filterDeal:fwFunctionFilterDeal
                                    }">
</template>

<script>
    // 当前选中的菜单
    var currentSelectMenu = null;

    // 更新当前选中菜单
    function chgSelectMenu(obj, newvalue) {
        currentSelectMenu = obj;
    }

    // 更新当前选中菜单
    function functionComboxClick(obj) {
        currentSelectMenu = obj;
    }

    // panel隐藏
    function functionPanelHide() {
        if (currentSelectMenu) {
            $.ei.openNewTab(currentSelectMenu.objData.functionName, currentSelectMenu.objData.functionUrl, currentSelectMenu.objData.icon, currentSelectMenu.id);
        }
        currentSelectMenu = null;
        // 重新加载数据
        $("#myIndexFormFunctionGUID").iCombobox('setValue', '');
        $("#myIndexFormFunctionGUID").iCombobox('reload');
        if ($("#MySearchMenuDialog").length >= 1) {
            $("#MySearchMenuDialog").iDialog('close');
        }

    }

    // 格式化菜单展示
    function formatSearchFunctionCombox(row) {
        return '<span style="cursor: pointer;"> <i class="{0}" aria-hidden="true"></i>&nbsp;{1}</span>'.format(row.objData.icon || 'fa fa-file-text-o', row.objData.functionName);
    }

    function fwFunctionFilterDeal(filter, value) {
        if (value) {
            filter.innerType = "or";
            filter.filters = [{
                type: "and",
                conditions: [filter.conditions[1]]
            }];

            filter.conditions.splice(1, 1);
            filter.conditions.push({
                attribute: "functionPinYin",
                datatype: "varchar",
                operatoer: "like",
                value: value
            })

            filter.conditions.push({
                attribute: "functionFirstLeShort",
                datatype: "varchar",
                operatoer: "like",
                value: value
            })
        }

    }
</script>